﻿@{
    ViewData["Title"] = "车间管理";
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>新增车间</title>
    <link href="//unpkg.com/layui@2.9.17/dist/css/layui.css" rel="stylesheet">
</head>
<body>
    <form class="layui-form layui-form-pane" action="">
        <div class="layui-form-item">
           <div class="layui-form-item">
    <label class="layui-form-label"><span style="color:red">*</span>车间编码</label>
    <div class="layui-input-inline" style="width: 180px;">
        <input type="text" name="workshopCode" autocomplete="off" placeholder="请输入车间编码" lay-verify="required|workshopCode" class="layui-input" id="workshopCode"> 
    </div>
    <div class="layui-input-inline">
        <input type="checkbox" name="switch" lay-skin="switch" lay-text="OFF|ON" lay-filter="switchFilter">自动生成
    </div>
</div>

        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span style="color:red">*</span>车间名称</label>
            <div class="layui-input-block">
                <input type="text" name="workshopName" autocomplete="off" placeholder="请输入车间名称" lay-verify="required|workshopName" class="layui-input" id="workshopName">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">面积</label>
                <div class="layui-input-inline" style="width: 100px;">
                    <input type="number" name="area" placeholder="" autocomplete="off" class="layui-input" lay-verify="required|area" min="0" step="1" value="0" lay-affix="number" id="area">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">负责人</label>
            <div class="layui-input-block">
                <input type="text" name="charger" autocomplete="off" placeholder="请输入负责人" lay-verify="required|charger" class="layui-input" id="charger">
            </div>
        </div>
        <div class="layui-form-item" pane>
            <label class="layui-form-label"><span style="color:red">*</span>是否启用</label>
            <div class="layui-input-block">
                <input type="radio" name="enableFlag" value="Y" title="是" id="Y" checked>
                <input type="radio" name="enableFlag" value="F" title="否" id="F" >
            </div>
        </div>
       <div class="layui-form-item layui-form-text"><label class="layui-form-label">备注</label><div class="layui-input-block"><textarea placeholder="请输入内容" class="layui-textarea" name="remark" id="remark"></textarea></div></div>

        <div class="layui-form-item">
            <button class="layui-btn" lay-submit lay-filter="demo3">保存</button>
            <button type="reset" class="layui-btn layui-btn-primary">取消</button>
        </div>
    </form>
    <script src="~/Scripts/jquery-3.4.1.min.js"></script>
    <script src="//unpkg.com/layui@2.9.17/dist/layui.js"></script>
    <script>
        //JavaScript代码
        layui.use(['form'], function () {
            var form = layui.form;
            var layer = layui.layer;
      form.on('switch(switchFilter)', function(data) {
        if(data.elem.checked) {
          var prefix ='WS';
          var num = new Date().getTime(); // 使用当前时间戳生成数字部分
          document.getElementById('workshopCode').value = prefix + num;
        } else {
          document.getElementById('workshopCode').value = '';
        }
      });
            // 表单验证
            form.verify({
                // 车间编码验证
                workshopCode: function (value) {
                    if (value.length > 20) {
                        return '车间编码不能超过20个字符';
                    }
                    // 车间编码不能包含特殊字符
                    var reg = /[`~!#$%^&*()_+<>?:"{},.\/;'[\]]/im;
                    if (reg.test(value)) {
                        return '车间编码不能包含特殊字符';
                    }
                },
                // 车间名称验证
                workshopName: function (value) {
                    if (value.length > 20) {
                        return '车间名称不能超过20个字符';
                    }
                },
                // 面积验证
                area: function (value) {
                    if (value < 0) {
                        return '面积不能小于0';
                    }
                },
                // 负责人验证
                charger: function (value) {
                    if (value.length > 20) {
                        return '负责人不能超过20个字符';
                    }
                },
                // 启用状态验证
                enableFlag: function (value) {
                    if (value == '') {
                        return '请选择启用状态';
                    }
                }
            });
          
            // 添加事件
            form.on('submit(demo3)', function (data) {
                var field = data.field; // 获取表单字段值
                     // 此处可执行 Ajax 等操作
                $.get("/Song/AddMdWorkshop", field, res => {
                    if (res) {
                        layer.msg('保存成功', {
                            icon: 1,
                            time: 2000
                        }, function () {
                            var index = parent.layer.getFrameIndex(window.name);//先得到当前iframe层的索引
                            parent.layer.close(index);//再执行关闭
                        });
                    }
                    else {
                        layer.msg('名称已存在', {
                            icon: 2,
                            time: 2000
                        });
                    }
                });
                return false; // 阻止默认 form 跳转
            });
        });
    </script>
</body>
</html>
